<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <p>Object.defineProperty test</p>
    <p>模拟</p>

    <script type="text/javascript">
        // var obj = {
        //     name: 'zhangsan',
        //     age: 25
        // }
        // console.log(obj)

        // var obj = {}
        // var _name = 'shangsan'
        // Object.defineProperty(obj, 'name', {
        //     get: function () {
        //         console.log('get', _name) // 监听
        //         return _name
        //     },
        //     set: function (newVal) {
        //         console.log('set', newVal)  // 监听
        //         _name = newVal
        //     }
        // })




        // var vm = new Vue({
        //     el: '#app',
        //     data: {
        //         name: 'zhangsan',
        //         age: 20
        //     }
        // })

        var vm = {}
        var data = {
            name: 'zhangsan',
            age: 20
        }

        var key, value
        for (key in data) {
            (function (key) {
                Object.defineProperty(vm, key, {
                    get: function () {
                        console.log('get', data[key]) // 监听
                        return data[key]
                    },
                    set: function (newVal) {
                        console.log('set', newVal) // 监听
                        data[key] = newVal
                    }
                })
            })(key)
        }


    </script>
</body>
</html>